<template>
  <div >
      <div v-if="data.cid">
        <van-nav-bar
        title="详情"
        left-text="返回"
        
        left-arrow
        @click-left="$router.go(-1)"
       
        />
        <van-swipe  :autoplay="1000" indicator-color="yellowgreen">
            <van-swipe-item  v-for="v in data.imgarr" :key="v">
            <van-image class="my-swipe" :src='v' />
            </van-swipe-item>
            
        </van-swipe>

        <van-cell-group>
        <van-cell :title="data.tname+'    ￥'+data.price" :label='data.tintro' />
        <!-- <van-cell title="单元格" value="内容" label="描述信息" /> -->
        </van-cell-group>

         <van-image :src='data.banner' />
         <div style="height:50px"></div>
         <van-goods-action :placeholder='true'>
            <van-goods-action-icon icon="chat-o" text="客服" @click="tel()" />
            <van-goods-action-icon icon="cart-o" text="购物车" @click="$router.push('/main/car')" />
            <van-goods-action-button @click="addcar()" color="yellowgreen" type="warning" text="加入购物车" />
            <van-goods-action-button color="green" type="danger" text="立即购买" />
         </van-goods-action>
      </div>
  </div>
</template>
<script>
import {Det} from "@/utils/api"
import {set,get} from "@/utils/local"
export default {
  data() {
    return {
        data:{}
    }
  },
  mounted(){
     this.getData()
  },
  computed:{

  },
  methods:{
     getData(){
        Det(this.$route.query)// {tid:1}
        .then(res=>{
            console.log(res);
            if(res.code==200){
                this.data=res.data
            }
        })
     },
     tel(){
        // console.log(6666);
        location.href="tel:13212742015"
     },
     addcar(){
        // console.log(666);
        let {tname,tid,timg,price}=this.data
        let params={// 组装购物车数据字段
           tname,tid,timg,price,pnum:1
        }

        // console.log(params);
        // 获取购物车 
        let cararr=get("car")||[]
        console.log(cararr);
        // 判断购物车内是否已经存在当前商品
        // 如果存在 数量++ 如果不存在 添加
        // cararr.push(params)

        let t=cararr.some(v=>{
            // v 购物车的商品
            // 
            if(v.tid==params.tid){// 购物车内存在当前商品 数量++
               v.pnum++

            }
            return v.tid==params.tid
        })
       if(!t){// 购物车内没有当前商品
           cararr.push(params)
       }

       // 存本地存储

       set("car",cararr)


     }
  },
}
</script>
<style scoped>
.my-swipe{
    height: 250px;
    width: 100%;
}
.van-cell__title span{
    color: yellowgreen;
}
</style>
